<#include "/common/head.ftl">

<div id="error" style="display:none;"></div>

<form action="study/editOfferingMember.sgt" validator="study/validateOfferingMember.sgt" onsubmit="submitFormValidation(this);return false" onreset="$('error').hide();" >
	<input type="hidden" name="id" value="${offeringMember.id}"/>
	
	<table align="center" cellspacing="10" cellpadding="0">
			<tr>
				<td colspan="2" style="color:#655F8F;border-bottom:1px dashed green">
					<div style="font-weight:bold;float:left">Student Information</div>
					<div style="float:right">
						<a href="#" onclick="cc('student/showInfoStudent.sgt?id=${offeringMember.receipt.student.id}')">Details</a>
					</div>
				</td>
			</tr>
			<tr>
				<td style="width:100px;font-weight:bold">${i18n.getMessage('lastName')}:</td>
				<td><input type="text" name="lastName" value="${(offeringMember.receipt.student.lastName)!}" style="width:200px"/></td>
			</tr>
			<tr>
				<td style="width:100px;font-weight:bold">${i18n.getMessage('firstName')}:</td>
				<td><input type="text" name="firstName" value="${(offeringMember.receipt.student.firstName)!}" style="width:200px"/></td>
			</tr>
			<tr>
				<td style="width:100px;font-weight:bold">${i18n.getMessage('nickName')}:</td>
				<td><input type="text" name="nickName" value="${(offeringMember.receipt.student.nickName)!}" style="width:200px"/></td>
			</tr>	
			<tr>
				<td style="width:100px;font-weight:bold">${i18n.getMessage('gender')}:</td>
				<td>
					<input type="radio" name="gender" value="MALE" <#if 'MALE' = (offeringMember.receipt.student.gender)!>checked</#if>/> ${i18n.getMessage('gender.male')}
					<input type="radio" name="gender" value="FEMALE" <#if 'FEMALE' = (offeringMember.receipt.student.gender)!>checked</#if>/> ${i18n.getMessage('gender.female')}
				</td>
			</tr>
			<tr>
				<td style="font-weight:bold">${i18n.getMessage('dateOfBirth')}:</td>
				<td><input type="text" name="dateOfBirth" value="${(offeringMember.receipt.student.dateOfBirth?date)!}" style="width:200px"/><img class="calendarImg" src="images/calendar/calendar.gif" onclick="displayCalendar(document.forms[0].dateOfBirth, '${i18n.getMessage('format.date')}', this)"/></td>
			</tr>
		<tr>
			<td style="font-weight:bold">${i18n.getMessage('address')}:</td>
			<td><input type="text" name="address" value="${(offeringMember.receipt.student.address)!}" style="width:200px"/></td>
		</tr>
		<tr>
			<td style="font-weight:bold">${i18n.getMessage('email')}:</td>
			<td><input type="text" name="email" value="${(offeringMember.receipt.student.email)!}" style="width:200px"/></td>
		</tr>
		<tr>
			<td style="font-weight:bold">${i18n.getMessage('phoneNumber')}:</td>
			<td><input type="text" name="phoneNumber" value="${(offeringMember.receipt.student.phoneNumber)!}" style="width:200px"/></td>
		</tr>
		<tr>
			<td style="font-weight:bold">${i18n.getMessage('type')}:</td>
			<td>
				<select name="typeId" style="width:204px">
					<#list types as type>
						<option value="${(type.id)!}" <#if type=offeringMember.receipt.student.type>selected</#if>>${(type.name)!}</option>
					</#list>
				</select>
			</td>
		</tr>
		<tr>
			<td style="font-weight:bold">Consulted Date:</td>
			<td><input type="text" name="consultedDate" value="${(offeringMember.receipt.student.consultedDate?date)!}" style="width:200px"/><img class="calendarImg" src="images/calendar/calendar.gif" onclick="displayCalendar(document.forms[0].consultedDate, '${i18n.getMessage('format.date')}', this)"/></td>
		</tr>
		<tr>
			<td style="font-weight:bold">${i18n.getMessage('program')}:</td>
			<td>
				<select name="programId" style="width:204px">
					<option></option>
					<#list programs as program>
						<option value="${program.id}" <#if program == (offeringMember.receipt.student.program)!>selected</#if>>${(program.name)!}</option>
					</#list>
				</select>
			</td>
		</tr>
		<tr>
			<td style="font-weight:bold">Test Date:</td>
			<td><input type="text" name="testDate" value="${(offeringMember.receipt.student.testDate?date)!}" style="width:200px"/><img class="calendarImg" src="images/calendar/calendar.gif" onclick="displayCalendar(document.forms[0].testDate, '${i18n.getMessage('format.date')}', this)"/></td>
		</tr>
		<tr>
			<td style="font-weight:bold">${i18n.getMessage('Consultant')}:</td>
			<td>
				<select name="consultantId" style="width:204px">
					<option></option>
					<#list consultants as consultant>
						<option value="${(consultant.id)!}" <#if consultant == (offeringMember.receipt.student.consultant)!>selected</#if>>${(consultant.fullName)!}</option>
					</#list>
				</select>
			</td>
		</tr>
		<tr>
			<td style="font-weight:bold;vertical-align:top">${i18n.getMessage('comment')}:</td>
			<td><textarea name="comment" style="width:280px;height:80px;">${(offeringMember.receipt.student.comment)!}</textarea></td>
		</tr>
		<tr>
			<td style="font-weight:bold;vertical-align:top">Study Note:</td>
			<td><textarea name="studyNote" style="width:280px;height:80px;">${(offeringMember.comment)!}</textarea></td>
		</tr>
			<tr>
				<td class="name"></td>
				<td>
					<input type="submit" value="${i18n.getMessage('edit')}" class="button_style"/> 
					<input type="reset" value="${i18n.getMessage('reset')}" class="button_style"/> 
				</td>
			</tr>
	</table>
</form>

<script>
	$('error').hide();
</script>